<template>
    <div>
        <el-dialog title="用户新增" :visible.sync="dialogFormVisible" :before-close="closeDialog">
            <el-form :model="form">
                <el-form-item label="名称" :label-width="formLabelWidth">
                    <el-input v-model="form.name" style="width:217px" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="创建时间" :label-width="formLabelWidth">
                    <el-date-picker v-model="form.date" type="date" prop="date" value-format="yyyy-MM-dd  HH:mm:ss" placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="用户状态" :label-width="formLabelWidth">
                    <el-switch v-model="ustatus" active-color="#13ce66" inactive-color="#ff4949">
                    </el-switch>
                </el-form-item>
                <el-form-item label="用户角色" :label-width="formLabelWidth">
                <el-select v-model="roles" multiple placeholder="请选择">
                    <el-option v-for="item in roleData" :key="item.id" :label="item.namezh" :value="item.id">
                    </el-option>
                </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="closeDialog">取 消</el-button>
                <el-button type="primary" @click="commitDialog">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        return {
            form: {
                name: "",
                region: ""
            },
            roles:[],//角色集合
            ustatus: true, //用户状态
            uenable: "",
            formVisible: this.dialogFormVisible,
            formLabelWidth: "120px"
        };
    },
    props: ["dialogFormVisible","roleData"],
    methods: {
        closeDialog() {
            this.$emit("formchange", false);
        },
        commitDialog() {
            let params = {
                name: this.form.name,
                createdate: this.form.date,
                enabled: this.ustatus,
                address: "北安市",
                roleIds:this.roles
            };
            this.$http
                .post("/user/adduserInfo", JSON.stringify(params), {
                    headers: { "Content-Type": "application/json" }
                })
                .then(res => {
                    if (res.status == 200) {
                        this.closeDialog();
                        this.$emit("freshFrom");
                    }
                })
                .catch(err => {});
        }
    },
    watch: {
        ustatus(val) {
            if (val) {
                this.uenable = 1;
            } else {
                this.uenable = 0;
            }
        }
    }
};
</script>


<style scoped>
</style>
